<!--
*@author 白晴语
*@date 2023-10-12 10:00
*@description:
-->
<template>
  <el-menu style="background-color: #ffffff"
      :default-active="activeIndex"
      class="el-menu-demo"
      mode="horizontal"
      :ellipsis="false"
      @select="handleSelect"
  >
    <el-menu-item index="1" v-if="sign===0">登录</el-menu-item>
    <el-col :span="12" v-if="sign===1">
      <div class="sub-title"></div>
      <div class="demo-basic--circle">
        <div class="block">
          <el-avatar :size="50" :src="circleUrl" />
        </div>
        <div v-for="size in sizeList" :key="size" class="block">
          <el-avatar :size="size" :src="circleUrl" />
        </div>
      </div>
    </el-col>
    <el-link v-if="sign==1" @click="remove">退出登录</el-link>
    <div style="position: absolute;right: 5%;display: flex">
      <el-menu-item index="2">首页</el-menu-item>
      <el-menu-item v-if="open==1" index="3">咨询师问答</el-menu-item>
      <el-menu-item v-if="open==0" disabled index="3">咨询师问答</el-menu-item>
      <el-menu-item index="5">情绪测试</el-menu-item>
      <el-menu-item index="4">没有登录？快加入我们吧~</el-menu-item>
    </div>

  </el-menu>
</template>
<script>
import {getCookie} from '../utils/cookie'
import { ElMessage } from 'element-plus'
export default {
  name: "NavBar",
  components: {},
  props: {},
  data() {
    return {
      open:0,
      circleUrl:"https://web-tias-fc.oss-cn-chengdu.aliyuncs.com/8f78c5cd-9a8c-456c-9fe8-ee301ddd5c5a.jpg",
      sign:0,
      activeIndex: 1,
    }
  },
  methods: {
    remove(){
      sessionStorage.removeItem("user")
      this.sign=0
      ElMessage({
        message: "退出成功",
        type:'success'
      })
    },
    handleSelect(key, keyPath) {
      switch (key) {
        case '1':
          this.$emit('skipRouter', '/')
          break;
        case '2':
          this.$emit('skipRouter', '/index')
          break;
        case '3':

          this.$emit('skipRouter', '/chat')
          break;
        case '4':
          this.$emit('skipRouter', '/register')
          break;
        case '5':
          this.open=1
          if (getCookie('token') !== null){
            ElMessage({
              message: '请先登录',
              type:'error'
            })
          }else {
            ElMessage({
              message: '欢迎来到Test',
              type:'success'
            })
            this.$emit('skipRouter', '/test')
          }
          break;
      }
    }
  },
  setup() {

  },mounted() {
    const user=JSON.parse(sessionStorage.getItem('user'))||[]
    console.log(user)
    if (user.length!=0){
      this.sign=1
    }
  }
}
</script>

<style scoped lang="less">
.flex-grow {
  flex-grow: 1;
}
.el-col-12{
  max-width:5%
}
</style>
 